<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>页面测试部分</title>
    <link rel="stylesheet" href="../../static/layui/dist/css/layui.css">
    <link rel="stylesheet" href="../../static/lib/magicsuggest/magicsuggest.css">
    <!--<link href="https://cdn.bootcss.com/bootstrap/4.1.1/css/bootstrap-grid.min.css" rel="stylesheet">-->
</head>
<body>

    <input id="ms" name="countries[]"/>
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
    <!--<script src="https://cdn.bootcss.com/bootstrap/4.1.1/js/bootstrap.bundle.min.js"></script>-->
    <script src="../../static/layui/dist/layui.js"></script>
    <script src="../../static/lib/magicsuggest/magicsuggest.js"></script>
    <script>
        //注意：导航 依赖 element 模块，否则无法进行功能性操作
        layui.use('element', function(){
            var element = layui.element;
            var $ = layui.jquery;

        });
        $(function () {
            $('#ms').magicSuggest({
                data: [{
                    "tag_id": 3,
                    "article_id": 3,
                    "id": 3,
                    "name": "函数",
                    "num": 4,
                    "link": "\/index\/article\/tag\/3"
                }, {
                    "tag_id": 6,
                    "article_id": 6,
                    "id": 6,
                    "name": "日期",
                    "num": 2,
                    "link": "\/index\/article\/tag\/6"
                }, {
                    "tag_id": 5,
                    "article_id": 5,
                    "id": 5,
                    "name": "计划",
                    "num": 2,
                    "link": "\/index\/article\/tag\/5"
                }, {
                    "tag_id": 4,
                    "article_id": 4,
                    "id": 4,
                    "name": "总结",
                    "num": 2,
                    "link": "\/index\/article\/tag\/4"
                }, {
                    "tag_id": 7,
                    "article_id": 7,
                    "id": 7,
                    "name": "参数",
                    "num": 1,
                    "link": "\/index\/article\/tag\/7"
                }, {
                    "tag_id": 2,
                    "article_id": 2,
                    "id": 2,
                    "name": "h5",
                    "num": 1,
                    "link": "\/index\/article\/tag\/2"
                }, {
                    "tag_id": 1,
                    "article_id": 1,
                    "id": 1,
                    "name": "php",
                    "num": 1,
                    "link": "\/index\/article\/tag\/1"
                }],
                valueField: 'id',
                displayField: 'name',
                maxSelection: 5,
            })
        })
    </script>
</body>
</html>